<template>
  <!-- 问题澄清表单弹窗 -->
  <el-dialog
    :close-on-click-modal="false"
    v-model="visibleDialog"
    :title="props.title"
    width="1050px"
    draggable
    @close="closeDialog"
  >
    <el-form :model="formData" :inline="true" label-width="100px">
      <el-form-item label="问题编号">
        <el-input
          v-model="formData.qualityProblemCode"
          placeholder="请输入问题编号"
          clearable
          disabled
          @keyup.enter="search"
        />
      </el-form-item>
      <el-form-item label="问题提出部门">
        <el-tree-select
          placeholder="请选择问题提出部门"
          v-model="formData.proposeDepartmentId"
          :data="organizationList"
          :render-after-expand="false"
          :check-strictly="true"
          disabled
          node-key="id"
          :props="{
            label: 'organizationCode',
            value: 'id',
            children: 'nodes',
          }"
          style="width: 100%"
          clearable
        />
      </el-form-item>

      <el-form-item label="责任部门">
        <el-tree-select
          placeholder="请选择责任部门"
          v-model="formData.departmentId"
          :data="organizationList"
          :render-after-expand="false"
          :check-strictly="true"
          disabled
          node-key="id"
          :props="{
            label: 'organizationCode',
            value: 'id',
            children: 'nodes',
          }"
          style="width: 100%"
          clearable
        />
      </el-form-item>
      <el-form-item label="问题状态">
        <el-select
          v-model="formData.releaseState"
          placeholder="请选择问题状态"
          clearable
          style="width: 100%"
          disabled
        >
          <el-option
            v-for="item in dictionaryStore.filterDictList('releaseState2')"
            :key="item.value"
            :label="item.label"
            :value="Number(item.value)"
          />
        </el-select>
      </el-form-item>

      <el-form-item label="问题分类" prop="problemTypeCode">
        <el-select
          v-model="formData.problemTypeCode"
          placeholder="请选择问题分类"
          clearable
          style="width: 100%"
          disabled
        >
          <el-option
            v-for="item in dictionaryStore.filterDictList('ExceptionType')"
            :key="item.value"
            :label="item.label"
            :value="Number(item.value)"
          />
        </el-select>
      </el-form-item>
      <el-form-item label="严重程度" prop="exceptionLevel">
        <el-select
          v-model="formData.exceptionLevel"
          placeholder="请选择严重程度"
          clearable
          style="width: 100%"
          disabled
        >
          <el-option
            v-for="item in problemLevelList"
            :key="item.id"
            :label="item.exceptionLevelCode"
            :value="item.id"
          />
        </el-select>
      </el-form-item>
      <el-form-item label="内部外部">
        <el-select
          v-model="formData.isInternal"
          placeholder="请选择内部外部"
          clearable
          style="width: 100%"
          disabled
        >
          <el-option
            v-for="item in dictionaryStore.filterDictList('isInternal')"
            :key="item.value"
            :label="item.label"
            :value="Number(item.value)"
          />
        </el-select>
      </el-form-item>
      <el-form-item label="处理类型" prop="problemApproachType">
        <el-select
          v-model="formData.problemApproachType"
          placeholder="请选择处理类型"
          clearable
          style="width: 100%"
          disabled
        >
          <el-option
            v-for="item in dictionaryStore.filterDictList('ApproachType')"
            :key="item.value"
            :label="item.label"
            :value="Number(item.value)"
          />
        </el-select>
      </el-form-item>

      <!-- <el-form-item>
        <el-button type="primary" @click="search"
          ><i-ep-search />搜索</el-button
        >
        <el-button @click="reset"><i-ep-refresh />重置</el-button>
      </el-form-item> -->
    </el-form>
    <el-table
      ref="dataTableRef"
      class="formTable"
      v-loading="loading"
      :data="formData.workOrderList"
      highlight-current-row
      border
      @selection-change="handleSelectionChange"
      style="max-height: 300px; overflow: auto"
    >
      <el-table-column
        label="顺序"
        prop="sequenceCode"
        min-width="90"
        show-overflow-tooltip
        align="center"
      />
      <el-table-column
        label="工单任务"
        prop="exceptionBusinessType"
        min-width="120"
        show-overflow-tooltip
        align="left"
      >
        <template #default="scope">
          {{
            dictionaryStore.filterDictName(
              "problemTicket",
              scope.row.exceptionBusinessType
            )
          }}
        </template>
      </el-table-column>
      <el-table-column
        label="完成时间"
        prop="completeTime"
        min-width="120"
        show-overflow-tooltip
        align="center"
      />
      <el-table-column
        label="负责人"
        prop="superintendentName"
        min-width="120"
        show-overflow-tooltip
        align="center"
      />

      <el-table-column fixed="right" label="操作" width="100">
        <template #default="scope">
          <el-button
            type="primary"
            size="small"
            link
            @click="taskFilling(scope.row, '查看')"
            ><i-ep-search />
            查看
          </el-button>
        </template>
      </el-table-column>
    </el-table>

    <!-- <el-pagination
      :background="true"
      :current-page="pageable.pageNum"
      :page-size="pageable.pageSize"
      :page-sizes="[10, 25, 50, 100]"
      :total="pageable.total"
      layout="total, sizes, prev, pager, next, jumper"
      class="mt-[20px]"
      @size-change="handleSizeChange"
      @current-change="handleCurrentChange"
    /> -->
    <template #footer>
      <div class="dialog-footer">
        <el-button
          v-if="!props.isReadonly"
          type="primary"
          :loading="loading"
          @click="handleSubmit"
          >确 定</el-button
        >
        <el-button @click="closeDialog">取 消</el-button>
      </div>
    </template>

    <!-- 工单弹窗 -->
    <q8dd1-edit
      :visible="addDialogQ8dd1Edit.visible"
      :title="addDialogQ8dd1Edit.title"
      :data="addDialogQ8dd1Edit.data"
      @reset-table="(id:string) => (id?.length ? getTableList() : reset())"
      :is-readonly="addDialogQ8dd1Edit.readvisible"
      @change-visible="changeVisibleQ8dd1Edit"
    />
    <q8dd2-edit
      :visible="addDialogQ8dd2Edit.visible"
      :title="addDialogQ8dd2Edit.title"
      :data="addDialogQ8dd2Edit.data"
      @reset-table="(id:string) => (id?.length ? getTableList() : reset())"
      :is-readonly="addDialogQ8dd2Edit.readvisible"
      @change-visible="changeVisibleQ8dd2Edit"
    />
    <q8dd3a1-edit
      :visible="addDialogQ8dd3a1Edit.visible"
      :title="addDialogQ8dd3a1Edit.title"
      :data="addDialogQ8dd3a1Edit.data"
      @reset-table="(id:string) => (id?.length ? getTableList() : reset())"
      :is-readonly="addDialogQ8dd3a1Edit.readvisible"
      @change-visible="changeVisibleQ8dd3a1Edit"
    />
    <q8dd3a2-edit
      :visible="addDialogQ8dd3a2Edit.visible"
      :title="addDialogQ8dd3a2Edit.title"
      :data="addDialogQ8dd3a2Edit.data"
      @reset-table="(id:string) => (id?.length ? getTableList() : reset())"
      :is-readonly="addDialogQ8dd3a2Edit.readvisible"
      @change-visible="changeVisibleQ8dd3a2Edit"
    />
    <q8dd3a3-edit
      :visible="addDialogQ8dd3a3Edit.visible"
      :title="addDialogQ8dd3a3Edit.title"
      :data="addDialogQ8dd3a3Edit.data"
      @reset-table="(id:string) => (id?.length ? getTableList() : reset())"
      :is-readonly="addDialogQ8dd3a3Edit.readvisible"
      @change-visible="changeVisibleQ8dd3a3Edit"
    />
    <q8dd3b1-edit
      :visible="addDialogQ8dd3b1Edit.visible"
      :title="addDialogQ8dd3b1Edit.title"
      :data="addDialogQ8dd3b1Edit.data"
      @reset-table="(id:string) => (id?.length ? getTableList() : reset())"
      :is-readonly="addDialogQ8dd3b1Edit.readvisible"
      @change-visible="changeVisibleQ8dd3b1Edit"
    />
    <q8dd3b2-edit
      :visible="addDialogQ8dd3b2Edit.visible"
      :title="addDialogQ8dd3b2Edit.title"
      :data="addDialogQ8dd3b2Edit.data"
      @reset-table="(id:string) => (id?.length ? getTableList() : reset())"
      :is-readonly="addDialogQ8dd3b2Edit.readvisible"
      @change-visible="changeVisibleQ8dd3b2Edit"
    />
    <q8dd3b3-edit
      :visible="addDialogQ8dd3b3Edit.visible"
      :title="addDialogQ8dd3b3Edit.title"
      :data="addDialogQ8dd3b3Edit.data"
      @reset-table="(id:string) => (id?.length ? getTableList() : reset())"
      :is-readonly="addDialogQ8dd3b3Edit.readvisible"
      @change-visible="changeVisibleQ8dd3b3Edit"
    />
    <q8dd41-edit
      :visible="addDialogQ8dd41Edit.visible"
      :title="addDialogQ8dd41Edit.title"
      :data="addDialogQ8dd41Edit.data"
      @reset-table="(id:string) => (id?.length ? getTableList() : reset())"
      :is-readonly="addDialogQ8dd41Edit.readvisible"
      @change-visible="changeVisibleQ8dd41Edit"
    />
    <q8dd42-edit
      :visible="addDialogQ8dd42Edit.visible"
      :title="addDialogQ8dd42Edit.title"
      :data="addDialogQ8dd42Edit.data"
      @reset-table="(id:string) => (id?.length ? getTableList() : reset())"
      :is-readonly="addDialogQ8dd42Edit.readvisible"
      @change-visible="changeVisibleQ8dd42Edit"
    />
    <q8dd51-edit
      :visible="addDialogQ8dd51Edit.visible"
      :title="addDialogQ8dd51Edit.title"
      :data="addDialogQ8dd51Edit.data"
      @reset-table="(id:string) => (id?.length ? getTableList() : reset())"
      :is-readonly="addDialogQ8dd51Edit.readvisible"
      @change-visible="changeVisibleQ8dd51Edit"
    />
    <q8dd52-edit
      :visible="addDialogQ8dd52Edit.visible"
      :title="addDialogQ8dd52Edit.title"
      :data="addDialogQ8dd52Edit.data"
      @reset-table="(id:string) => (id?.length ? getTableList() : reset())"
      :is-readonly="addDialogQ8dd52Edit.readvisible"
      @change-visible="changeVisibleQ8dd52Edit"
    />
    <q8dd61-edit
      :visible="addDialogQ8dd61Edit.visible"
      :title="addDialogQ8dd61Edit.title"
      :data="addDialogQ8dd61Edit.data"
      @reset-table="(id:string) => (id?.length ? getTableList() : reset())"
      :is-readonly="addDialogQ8dd61Edit.readvisible"
      @change-visible="changeVisibleQ8dd61Edit"
    />
    <q8dd62-edit
      :visible="addDialogQ8dd62Edit.visible"
      :title="addDialogQ8dd62Edit.title"
      :data="addDialogQ8dd62Edit.data"
      @reset-table="(id:string) => (id?.length ? getTableList() : reset())"
      :is-readonly="addDialogQ8dd62Edit.readvisible"
      @change-visible="changeVisibleQ8dd62Edit"
    />

    <q8dd71-edit
      :visible="addDialogQ8dd71Edit.visible"
      :title="addDialogQ8dd71Edit.title"
      :data="addDialogQ8dd71Edit.data"
      @reset-table="(id:string) => (id?.length ? getTableList() : reset())"
      :is-readonly="addDialogQ8dd71Edit.readvisible"
      @change-visible="changeVisibleQ8dd71Edit"
    />
    <q8dd72-edit
      :visible="addDialogQ8dd72Edit.visible"
      :title="addDialogQ8dd72Edit.title"
      :data="addDialogQ8dd72Edit.data"
      @reset-table="(id:string) => (id?.length ? getTableList() : reset())"
      :is-readonly="addDialogQ8dd72Edit.readvisible"
      @change-visible="changeVisibleQ8dd72Edit"
    />
    <q8dd73-edit
      :visible="addDialogQ8dd73Edit.visible"
      :title="addDialogQ8dd73Edit.title"
      :data="addDialogQ8dd73Edit.data"
      @reset-table="(id:string) => (id?.length ? getTableList() : reset())"
      :is-readonly="addDialogQ8dd73Edit.readvisible"
      @change-visible="changeVisibleQ8dd73Edit"
    />
    <q8dd80-edit
      :visible="addDialogQ8dd80Edit.visible"
      :title="addDialogQ8dd80Edit.title"
      :data="addDialogQ8dd80Edit.data"
      @reset-table="(id:string) => (id?.length ? getTableList() : reset())"
      :is-readonly="addDialogQ8dd80Edit.readvisible"
      @change-visible="changeVisibleQ8dd80Edit"
    />
    <q8dn1-edit
      :visible="addDialogQ8dn1Edit.visible"
      :title="addDialogQ8dn1Edit.title"
      :data="addDialogQ8dn1Edit.data"
      @reset-table="(id:string) => (id?.length ? getTableList() : reset())"
      :is-readonly="addDialogQ8dn1Edit.readvisible"
      @change-visible="changeVisibleQ8dn1Edit"
    />
    <q8dn2-edit
      :visible="addDialogQ8dn2Edit.visible"
      :title="addDialogQ8dn2Edit.title"
      :data="addDialogQ8dn2Edit.data"
      @reset-table="(id:string) => (id?.length ? getTableList() : reset())"
      :is-readonly="addDialogQ8dn2Edit.readvisible"
      @change-visible="changeVisibleQ8dn2Edit"
    />
    <q8dn3-edit
      :visible="addDialogQ8dn3Edit.visible"
      :title="addDialogQ8dn3Edit.title"
      :data="addDialogQ8dn3Edit.data"
      @reset-table="(id:string) => (id?.length ? getTableList() : reset())"
      :is-readonly="addDialogQ8dn3Edit.readvisible"
      @change-visible="changeVisibleQ8dn3Edit"
    />
    <q8dn4-edit
      :visible="addDialogQ8dn4Edit.visible"
      :title="addDialogQ8dn4Edit.title"
      :data="addDialogQ8dn4Edit.data"
      @reset-table="(id:string) => (id?.length ? getTableList() : reset())"
      :is-readonly="addDialogQ8dn4Edit.readvisible"
      @change-visible="changeVisibleQ8dn4Edit"
    />
  </el-dialog>
</template>

<script setup lang="ts">
import request from "@/utils/request";
import { useDictStoreHook } from "@/store/modules/dictionary"; // 引入
const dictionaryStore = useDictStoreHook();
import { useTable, useDownload, useDictionary } from "@/utils/useTable";

defineOptions({
  name: "QMSQ8DLOOKALLWORKADDORUPDATE",
  inheritAttrs: false,
});

const emit = defineEmits(["reset-table", "change-visible"]);

const props = defineProps({
  visible: {
    type: Boolean,
    default: () => {
      return false;
    },
  },
  title: {
    type: String,
    default: () => {
      return "";
    },
  },
  data: {
    type: Object,
    default: () => {
      return {};
    },
  },
  isReadonly: {
    type: Boolean,
    default: () => {
      return false;
    },
  },
});

const visibleDialog = ref(false);
watch(
  () => props.visible,
  (newVal: boolean) => {
    visibleDialog.value = newVal;
    // setTimeout(() => {
    //   formRef.value.clearValidate();
    // }, 50);
  }
);

const rules = reactive({
  qualityExceptionId: [
    { min: 1, max: 32, message: "长度在 1 到 32 个字符", trigger: "blur" },
  ],
  qualityExceptionCode: [
    { min: 1, max: 50, message: "长度在 1 到 50 个字符", trigger: "blur" },
  ],
  supplyId: [
    { min: 1, max: 32, message: "长度在 1 到 32 个字符", trigger: "blur" },
  ],
  supplyCode: [
    { min: 1, max: 50, message: "长度在 1 到 50 个字符", trigger: "blur" },
  ],
  supplyName: [
    { min: 1, max: 50, message: "长度在 1 到 50 个字符", trigger: "blur" },
  ],
  agreeWith: [],
  reasonCode: [],
  reasonContent: [
    { required: true, message: "请填写澄清理由", trigger: "blur" },
    { min: 1, max: 1000, message: "长度在 1 到 1000 个字符", trigger: "blur" },
  ],
  evaluationResult: [],
  evaluationResultUserId: [
    { min: 1, max: 32, message: "长度在 1 到 32 个字符", trigger: "blur" },
  ],
  evaluationResultUserName: [
    { min: 1, max: 50, message: "长度在 1 到 50 个字符", trigger: "blur" },
  ],
  evaluationResultContent: [
    { min: 1, max: 1000, message: "长度在 1 到 1000 个字符", trigger: "blur" },
  ],
  version: [],
  remarks: [
    { min: 1, max: 255, message: "长度在 1 到 255 个字符", trigger: "blur" },
  ],
  createTime: [],
  createdUserId: [
    { min: 1, max: 32, message: "长度在 1 到 32 个字符", trigger: "blur" },
  ],
  createdUserName: [
    { min: 1, max: 50, message: "长度在 1 到 50 个字符", trigger: "blur" },
  ],
  lastUpdateTime: [],
  lastUpdatedUserId: [
    { min: 1, max: 32, message: "长度在 1 到 32 个字符", trigger: "blur" },
  ],
  lastUpdatedUserName: [
    { min: 1, max: 50, message: "长度在 1 到 50 个字符", trigger: "blur" },
  ],
  enabled: [],
  deleted: [],
});

const formRef = ref(ElForm);

let formData = reactive({
  id: "",
  qualityProblemCode: "",
  qualityExceptionId: "",
  qualityExceptionCode: "",
  informationSourceId: "",
  lineProcessName: "",
  productProjectName: "",
  sortCodeId: "",
  sortCode: "",
  productProcess: "",
  failureMode: "",
  consequenceInfluence: "",
  problemFrequency: "",
  proposeDepartmentId: "",
  proposeDepartmentCode: "",
  proposeDepartmentName: "",
  proposeManagerId: "",
  proposeManagerName: "",
  departmentId: "",
  departmentCode: "",
  departmentName: "",
  departmentManagerId: "",
  departmentManagerName: "",
  isInternal: 1,
  supplyId: "",
  supplyCode: "",
  supplyName: "",
  problemTime: "",
  problemUserId: "",
  problemUserName: "",
  problemTypeCode: "",
  exceptionTypeSubId: "",
  exceptionTypeSubCode: "",
  exceptionTypeSubName: "",
  exceptionLevel: "",
  problemApproachId: "",
  problemApproachCode: "",
  problemApproachType: "",
  problemApproachName: "",
  releaseState: "",
  auditUserId: "",
  auditUserName: "",
  provisionalMeasuresDeadline: "",
  rectificationDeadline: "",
  rectificationRequirement: "",
  agreeWith: "",
  approvalOpinion: "",
  approvalTime: "",
  targetTime: "",
  version: "",
  remarks: "",
  createTime: "",
  createdUserId: "",
  createdUserName: "",
  lastUpdateTime: "",
  lastUpdatedUserId: "",
  lastUpdatedUserName: "",
  enabled: "",
  deleted: "",
  // 涉及数量
  qualityQuantity: 1,
  // 失效模式
  failureModeContent: "",
  // 发生地点
  occurrenceLocation: "",
  // 状态
  productProcessContent: "",
  sortName: "",
  // 图号编号
  materialProcessCode: "",
  materialProcessName: "",
  materialProcessId: "",
  materialProcessFigure: "",
  // 问题处理方式
  exceptionSolvingType: "",
  // 问题级别
  exceptionLevelCode: "",
  exceptionLevelName: "",
  exceptionLevelContent: "",
  // 8D问题反馈报告
  workOrderList: [
    {
      id: "",
      qualityExceptionId: "",
      qualityExceptionCode: "",
      supplyId: "",
      supplyCode: "",
      supplyName: "",
      agreeWith: 1,
      reasonCode: 0,
      reasonContent: "",
      evaluationResult: "",
      evaluationResultUserId: "",
      evaluationResultUserName: "",
      evaluationResultContent: "",
      version: "",
      remarks: "",
      createTime: "",
      createdUserId: "",
      createdUserName: "",
      lastUpdateTime: "",
      lastUpdatedUserId: "",
      lastUpdatedUserName: "",
      enabled: "",
      deleted: "",
      assetPhotos: [],
    },
  ],
});

watch(
  () => props.data,
  (newVal: any) => {
    formData.id = "";
    if (newVal?.id) {
      const {
        id,
        qualityProblemCode,
        qualityExceptionId,
        qualityExceptionCode,
        informationSourceId,
        lineProcessName,
        productProjectName,
        sortCodeId,
        sortCode,
        productProcess,
        failureMode,
        consequenceInfluence,
        problemFrequency,
        proposeDepartmentId,
        proposeDepartmentCode,
        proposeDepartmentName,
        proposeManagerId,
        proposeManagerName,
        departmentId,
        departmentCode,
        departmentName,
        departmentManagerId,
        departmentManagerName,
        isInternal,
        supplyId,
        supplyCode,
        supplyName,
        problemTime,
        problemUserId,
        problemUserName,
        problemTypeCode,
        exceptionTypeSubId,
        exceptionTypeSubCode,
        exceptionTypeSubName,
        exceptionLevel,
        problemApproachId,
        problemApproachCode,
        problemApproachType,
        problemApproachName,
        releaseState,
        auditUserId,
        auditUserName,
        provisionalMeasuresDeadline,
        rectificationDeadline,
        rectificationRequirement,
        agreeWith,
        approvalOpinion,
        approvalTime,
        targetTime,
        version,
        remarks,
        createTime,
        createdUserId,
        createdUserName,
        lastUpdateTime,
        lastUpdatedUserId,
        lastUpdatedUserName,
        enabled,
        deleted,
        qualityQuantity,
        failureModeContent,
        occurrenceLocation,
        productProcessContent,
        sortName,
        // 图号编号
        materialProcessCode,
        materialProcessName,
        materialProcessId,
        materialProcessFigure,
        exceptionSolvingType,
        exceptionLevelCode,
        exceptionLevelName,
        exceptionLevelContent,
        workOrderList,
      } = newVal;
      Object.assign(formData, {
        id,
        qualityProblemCode,
        qualityExceptionId,
        qualityExceptionCode,
        informationSourceId,
        lineProcessName,
        productProjectName,
        sortCodeId,
        sortCode,
        productProcess,
        failureMode,
        consequenceInfluence,
        problemFrequency,
        proposeDepartmentId,
        proposeDepartmentCode,
        proposeDepartmentName,
        proposeManagerId,
        proposeManagerName,
        departmentId,
        departmentCode,
        departmentName,
        departmentManagerId,
        departmentManagerName,
        isInternal,
        supplyId,
        supplyCode,
        supplyName,
        problemTime,
        problemUserId,
        problemUserName,
        problemTypeCode,
        exceptionTypeSubId,
        exceptionTypeSubCode,
        exceptionTypeSubName,
        exceptionLevel,
        problemApproachId,
        problemApproachCode,
        problemApproachType,
        problemApproachName,
        releaseState,
        auditUserId,
        auditUserName,
        provisionalMeasuresDeadline,
        rectificationDeadline,
        rectificationRequirement,
        agreeWith,
        approvalOpinion,
        approvalTime,
        targetTime,
        version,
        remarks,
        createTime,
        createdUserId,
        createdUserName,
        lastUpdateTime,
        lastUpdatedUserId,
        lastUpdatedUserName,
        enabled,
        deleted,
        qualityQuantity,
        failureModeContent,
        occurrenceLocation,
        productProcessContent,
        sortName,
        materialProcessCode,
        materialProcessName,
        materialProcessId,
        materialProcessFigure,
        exceptionSolvingType,
        exceptionLevelCode,
        exceptionLevelName,
        exceptionLevelContent,
        workOrderList: workOrderList ?? [],
      });
      formData.qualityExceptionId = id;
      formData.qualityExceptionCode = qualityProblemCode;
      console.log(formData);
    }
  }
);

/** 关闭表单弹窗 */
function closeDialog() {
  visibleDialog.value = false;
  emit("change-visible", false);
  resetForm();
}

/** 重置表单 */
function resetForm() {
  // formRef.value.resetFields();
  // formRef.value.clearValidate();
  formData.id = "";
  formData.qualityProblemCode = "";
  formData.qualityExceptionId = "";
  formData.qualityExceptionCode = "";
  formData.informationSourceId = "";
  formData.lineProcessName = "";
  formData.productProjectName = "";
  formData.sortCodeId = "";
  formData.sortCode = "";
  formData.productProcess = "";
  formData.failureMode = "";
  formData.consequenceInfluence = "";
  formData.problemFrequency = "";
  formData.proposeDepartmentId = "";
  formData.proposeDepartmentCode = "";
  formData.proposeDepartmentName = "";
  formData.proposeManagerId = "";
  formData.proposeManagerName = "";
  formData.departmentId = "";
  formData.departmentCode = "";
  formData.departmentName = "";
  formData.departmentManagerId = "";
  formData.departmentManagerName = "";
  formData.isInternal = 1;
  formData.supplyId = "";
  formData.supplyCode = "";
  formData.supplyName = "";
  formData.problemTime = "";
  formData.problemUserId = "";
  formData.problemUserName = "";
  formData.problemTypeCode = "";
  formData.exceptionTypeSubId = "";
  formData.exceptionTypeSubCode = "";
  formData.exceptionTypeSubName = "";
  formData.exceptionLevel = "";
  formData.problemApproachId = "";
  formData.problemApproachCode = "";
  formData.problemApproachType = "";
  formData.problemApproachName = "";
  formData.releaseState = "";
  formData.auditUserId = "";
  formData.auditUserName = "";
  formData.provisionalMeasuresDeadline = "";
  formData.rectificationDeadline = "";
  formData.rectificationRequirement = "";
  formData.agreeWith = "";
  formData.approvalOpinion = "";
  formData.approvalTime = "";
  formData.targetTime = "";
  formData.version = "";
  formData.remarks = "";
  formData.createTime = "";
  formData.createdUserId = "";
  formData.createdUserName = "";
  formData.lastUpdateTime = "";
  formData.lastUpdatedUserId = "";
  formData.lastUpdatedUserName = "";
  formData.enabled = "";
  formData.deleted = "";
  formData.qualityQuantity = 1;
  formData.occurrenceLocation = "";
  formData.productProcessContent = "";
  formData.sortName = "";
  formData.materialProcessCode = "";
  formData.materialProcessName = "";
  formData.materialProcessId = "";
  formData.materialProcessFigure = "";
  formData.exceptionSolvingType = "";
  formData.exceptionLevelCode = "";
  formData.exceptionLevelName = "";
  formData.exceptionLevelContent = "";
  formData.workOrderList = [];
}

const loading = ref(false);

/** 问题澄清保存提交 */
function handleSubmit() {
  console.log(formData);
  formRef.value.validate(async (valid: any) => {
    if (valid) {
      loading.value = true;
      const text = formData.id ? "问题确认成功！" : "问题确认成功！";
      await request({
        url: "/qms/q8dissueclarification/save",
        method: "post",
        data: formData,
      }).finally(() => {
        loading.value = false;
      });
      ElMessage.success(text + `成功`);
      closeDialog();
      emit("reset-table", formData.id);
    }
  });
}

const changAgreeWith = () => {
  console.log(formData.agreeWith);
};
// 图片处理
function updateFormFiles(val: []) {
  formData.assetPhotos = val;
}

// 请求参数
const requestApi = "/qms/q8dworkorder/queryByPage";

// 是否需要分页
const pagination = true;

const initParam = {};

// 初始化搜索参数数据
const searchParamInit = {
  qualityProblemCode: "",
  proposeDepartmentId: "",
  departmentId: "",
  releaseState: "",
  problemTypeCode: "",
  exceptionLevel: "",
  problemApproachType: "",
  isInternal: "",
  productProjectName: "",
};

const deleteParam = {
  api: "/qms/q8dqualityproblem/delete",
  data: {},
};

// 数据请求错误后处理
function requestError() {}

const dataCallBack = ref(undefined); // 无需二次数据处理&不传赞数也行

// 表格操作 Hooks
const {
  tableData,
  pageable,
  searchParam,
  ids,
  getTableList,
  search,
  reset,
  handleSizeChange,
  handleCurrentChange,
  handleSelectionChange,
  handleTableDelete,
}: any = useTable(
  requestApi,
  initParam,
  searchParamInit,
  pagination,
  dataCallBack.value,
  requestError,
  deleteParam
);

onMounted(() => {});

const addDialog = reactive<DialogOption>({
  visible: false,
  readvisible: false,
  title: "",
  data: {},
});

// 查询详情
async function getInfo(id: string) {
  request({
    url: `/qms/q8dqualityproblem/get/${id}`,
    method: "get",
  })
    .then((data) => {
      addDialog.data = data.data;
      addDialog.visible = true;
    })
    .catch((res) => {
      console.log(res);
    });
}

// 责任部门

const organizationList = ref([]);
const getOrganizationList = async () => {
  let res = await request({
    url: "/system/sysOrganization/getList",
    method: "post",
    data: { organizationType: 4 },
  }).finally(() => {});
  organizationList.value = res.data;
};

// 问题级别
const problemLevelList = ref([]);
const getProblemLevelList = async () => {
  let res = await request({
    url: "/qms/qmsexceptionlevel/getList",
    method: "post",
    data: {},
  }).finally(() => {});
  problemLevelList.value = res.data;
  console.log("problemLevelList", problemLevelList.value);
};

const NoTaskFilling = (id) => {
  ElMessageBox.confirm("确认取消该任务项?", "警告", {
    confirmButtonText: "确定",
    cancelButtonText: "取消",
    type: "warning",
  }).then(async () => {
    await request({
      url: `/qms/qmsexceptionlevel/cancellation/`,
      method: "post",
      data: { ids: [id] },
    }).then((res) => {
      ElMessage.success("取消成功！");
      search();
    });
  });
};

// 分派负责人弹窗
//1

const addDialogassignPerson = reactive<DialogOption>({
  visible: false,
  readvisible: false,
  title: "",
  data: {},
});
const assignPerson = (row) => {
  addDialogassignPerson.data = row;
  addDialogassignPerson.visible = true;

  if (type == "查看") {
    addDialogassignPerson.readvisible = true;
  } else {
    addDialogassignPerson.readvisible = false;
  }
};
function changeVisibleAssignPerson(value: boolean) {
  addDialogassignPerson.visible = value;
  if (!value) {
    addDialogassignPerson.data = {};
  }
}

// 任务填报
const taskFilling = (row: any, type: "") => {
  switch (row.exceptionBusinessType) {
    case 2:
      Q8dd1Edits(row, type);
      return;
    case 3:
      Q8dd2Edits(row, type);
      return;
    case 4:
      Q8dd3a1Edits(row, type);
      return;
    case 5:
      Q8dd3a2Edits(row, type);
      return;
    case 6:
      Q8dd3a3Edits(row, type);
      return;
    case 7:
      Q8dd3b1Edits(row, type);
      return;
    case 8:
      Q8dd3b2Edits(row, type);
      return;
    case 9:
      Q8dd3b3Edits(row, type);
      return;
    case 10:
      Q8dd41Edits(row, type);
      return;
    case 11:
      Q8dd42Edits(row, type);
      return;
    case 12:
      Q8dd51Edits(row, type);
      return;
    case 13:
      Q8dd52Edits(row, type);
      return;
    case 14:
      Q8dd61Edits(row, type);
      return;
    case 15:
      Q8dd62Edits(row, type);
      return;
    case 16:
      Q8dd71Edits(row, type);
      return;
    case 17:
      Q8dd72Edits(row, type);
      return;
    case 18:
      Q8dd73Edits(row, type);
      return;
    case 19:
      Q8dd80Edits(row, type);
      return;
    case 20:
      Q8dn1Edits(row, type);
      return;
    case 21:
      Q8dn2Edits(row, type);
      return;
    case 22:
      Q8dn3Edits(row, type);
      return;
    case 23:
      Q8dn4Edits(row, type);
      return;
  }
};

//1
const Q8dd1Edits = (row, type) => {
  addDialogQ8dd1Edit.title = "D1成立团队";
  addDialogQ8dd1Edit.data = row;
  addDialogQ8dd1Edit.visible = true;

  if (type == "查看") {
    addDialogQ8dd1Edit.readvisible = true;
  } else {
    addDialogQ8dd1Edit.readvisible = false;
  }
};
const addDialogQ8dd1Edit = reactive<DialogOption>({
  visible: false,
  readvisible: false,
  title: "",
  data: {},
});
function changeVisibleQ8dd1Edit(value: boolean) {
  addDialogQ8dd1Edit.visible = value;
  if (!value) {
    addDialogQ8dd1Edit.data = {};
  }
}
//2
const Q8dd2Edits = (row, type) => {
  addDialogQ8dd2Edit.title = "D2问题描述";
  addDialogQ8dd2Edit.data = row;

  addDialogQ8dd2Edit.visible = true;

  if (type == "查看") {
    addDialogQ8dd2Edit.readvisible = true;
  } else {
    addDialogQ8dd2Edit.readvisible = false;
  }
};
const addDialogQ8dd2Edit = reactive<DialogOption>({
  visible: false,
  readvisible: false,
  title: "",
  data: {},
});
function changeVisibleQ8dd2Edit(value: boolean) {
  addDialogQ8dd2Edit.visible = value;
  if (!value) {
    addDialogQ8dd2Edit.data = {};
  }
}
//3
const Q8dd3a1Edits = (row, type) => {
  addDialogQ8dd3a1Edit.title = "D3A1遏制措施的执行时间";
  addDialogQ8dd3a1Edit.data = row;

  addDialogQ8dd3a1Edit.visible = true;

  if (type == "查看") {
    addDialogQ8dd3a1Edit.readvisible = true;
  } else {
    addDialogQ8dd3a1Edit.readvisible = false;
  }
};
const addDialogQ8dd3a1Edit = reactive<DialogOption>({
  visible: false,
  readvisible: false,
  title: "",
  data: {},
});
function changeVisibleQ8dd3a1Edit(value: boolean) {
  addDialogQ8dd3a1Edit.visible = value;
  if (!value) {
    addDialogQ8dd3a1Edit.data = {};
  }
}
//4
const Q8dd3a2Edits = (row, type) => {
  addDialogQ8dd3a2Edit.title = "D3A2遏制措施的方案和验证过程";
  addDialogQ8dd3a2Edit.data = row;

  addDialogQ8dd3a2Edit.visible = true;

  if (type == "查看") {
    addDialogQ8dd3a2Edit.readvisible = true;
  } else {
    addDialogQ8dd3a2Edit.readvisible = false;
  }
};
const addDialogQ8dd3a2Edit = reactive<DialogOption>({
  visible: false,
  readvisible: false,
  title: "",
  data: {},
});
function changeVisibleQ8dd3a2Edit(value: boolean) {
  addDialogQ8dd3a2Edit.visible = value;
  if (!value) {
    addDialogQ8dd3a2Edit.data = {};
  }
}
//5
const Q8dd3a3Edits = (row, type) => {
  addDialogQ8dd3a3Edit.title = "D3A3遏制措施的实施过程完成时间";
  addDialogQ8dd3a3Edit.data = row;
  addDialogQ8dd3a3Edit.visible = true;

  if (type == "查看") {
    addDialogQ8dd3a3Edit.readvisible = true;
  } else {
    addDialogQ8dd3a3Edit.readvisible = false;
  }
};
const addDialogQ8dd3a3Edit = reactive<DialogOption>({
  visible: false,
  readvisible: false,
  title: "",
  data: {},
});
function changeVisibleQ8dd3a3Edit(value: boolean) {
  addDialogQ8dd3a3Edit.visible = value;
  if (!value) {
    addDialogQ8dd3a3Edit.data = {};
  }
}
//6
const Q8dd3b1Edits = (row, type) => {
  addDialogQ8dd3b1Edit.title = "D3B1短期措施实施前的短期控制措施执行时间";
  addDialogQ8dd3b1Edit.data = row;

  addDialogQ8dd3b1Edit.visible = true;

  if (type == "查看") {
    addDialogQ8dd3b1Edit.readvisible = true;
  } else {
    addDialogQ8dd3b1Edit.readvisible = false;
  }
};
const addDialogQ8dd3b1Edit = reactive<DialogOption>({
  visible: false,
  readvisible: false,
  title: "",
  data: {},
});
function changeVisibleQ8dd3b1Edit(value: boolean) {
  addDialogQ8dd3b1Edit.visible = value;
  if (!value) {
    addDialogQ8dd3b1Edit.data = {};
  }
}
//7
const Q8dd3b2Edits = (row, type) => {
  addDialogQ8dd3b2Edit.title = "D3B2短期措施控制方案和验证过程";
  addDialogQ8dd3b2Edit.data = row;
  addDialogQ8dd3b2Edit.visible = true;

  if (type == "查看") {
    addDialogQ8dd3b2Edit.readvisible = true;
  } else {
    addDialogQ8dd3b2Edit.readvisible = false;
  }
};

const addDialogQ8dd3b2Edit = reactive<DialogOption>({
  visible: false,
  readvisible: false,
  title: "",
  data: {},
});
function changeVisibleQ8dd3b2Edit(value: boolean) {
  addDialogQ8dd3b2Edit.visible = value;
  if (!value) {
    addDialogQ8dd3b2Edit.data = {};
  }
}
//8
const Q8dd3b3Edits = (row, type) => {
  addDialogQ8dd3b3Edit.title = "D3B3短期措施的追溯信息";
  addDialogQ8dd3b3Edit.data = row;

  addDialogQ8dd3b3Edit.visible = true;

  if (type == "查看") {
    addDialogQ8dd3b3Edit.readvisible = true;
  } else {
    addDialogQ8dd3b3Edit.readvisible = false;
  }
};
const addDialogQ8dd3b3Edit = reactive<DialogOption>({
  visible: false,
  readvisible: false,
  title: "",
  data: {},
});
function changeVisibleQ8dd3b3Edit(value: boolean) {
  addDialogQ8dd3b3Edit.visible = value;
  if (!value) {
    addDialogQ8dd3b3Edit.data = {};
  }
}
//9
const Q8dd41Edits = (row, type) => {
  addDialogQ8dd41Edit.title = "D41发生根本原因";
  addDialogQ8dd41Edit.data = row;

  addDialogQ8dd41Edit.visible = true;

  if (type == "查看") {
    addDialogQ8dd41Edit.readvisible = true;
  } else {
    addDialogQ8dd41Edit.readvisible = false;
  }
};
const addDialogQ8dd41Edit = reactive<DialogOption>({
  visible: false,
  readvisible: false,
  title: "",
  data: {},
});
function changeVisibleQ8dd41Edit(value: boolean) {
  addDialogQ8dd41Edit.visible = value;
  if (!value) {
    addDialogQ8dd41Edit.data = {};
  }
}
//10
const Q8dd42Edits = (row, type) => {
  addDialogQ8dd42Edit.title = "D42流出根本原因";
  addDialogQ8dd42Edit.data = row;

  addDialogQ8dd42Edit.visible = true;
  if (type == "查看") {
    addDialogQ8dd42Edit.readvisible = true;
  } else {
    addDialogQ8dd42Edit.readvisible = false;
  }
};
const addDialogQ8dd42Edit = reactive<DialogOption>({
  visible: false,
  readvisible: false,
  title: "",
  data: {},
});
function changeVisibleQ8dd42Edit(value: boolean) {
  addDialogQ8dd42Edit.visible = value;
  if (!value) {
    addDialogQ8dd42Edit.data = {};
  }
}
//11
const Q8dd51Edits = (row, type) => {
  addDialogQ8dd51Edit.title = "D51针对发生根本原因纠正措施";
  addDialogQ8dd51Edit.data = row;
  addDialogQ8dd51Edit.visible = true;

  if (type == "查看") {
    addDialogQ8dd51Edit.readvisible = true;
  } else {
    addDialogQ8dd51Edit.readvisible = false;
  }
};
const addDialogQ8dd51Edit = reactive<DialogOption>({
  visible: false,
  readvisible: false,
  title: "",
  data: {},
});
function changeVisibleQ8dd51Edit(value: boolean) {
  addDialogQ8dd51Edit.visible = value;
  if (!value) {
    addDialogQ8dd51Edit.data = {};
  }
}
//12
const Q8dd52Edits = (row, type) => {
  addDialogQ8dd52Edit.title = "D52针对流出根本原因纠正措施";
  addDialogQ8dd52Edit.data = row;

  addDialogQ8dd52Edit.visible = true;
  if (type == "查看") {
    addDialogQ8dd52Edit.readvisible = true;
  } else {
    addDialogQ8dd52Edit.readvisible = false;
  }
};
const addDialogQ8dd52Edit = reactive<DialogOption>({
  visible: false,
  readvisible: false,
  title: "",
  data: {},
});
function changeVisibleQ8dd52Edit(value: boolean) {
  addDialogQ8dd52Edit.visible = value;
  if (!value) {
    addDialogQ8dd52Edit.data = {};
  }
}
//13
const Q8dd61Edits = (row, type) => {
  addDialogQ8dd61Edit.title = "D61针对发生根本原因纠正措施验证";
  addDialogQ8dd61Edit.data = row;

  addDialogQ8dd61Edit.visible = true;

  if (type == "查看") {
    addDialogQ8dd61Edit.readvisible = true;
  } else {
    addDialogQ8dd61Edit.readvisible = false;
  }
};
const addDialogQ8dd61Edit = reactive<DialogOption>({
  visible: false,
  readvisible: false,
  title: "",
  data: {},
});
function changeVisibleQ8dd61Edit(value: boolean) {
  addDialogQ8dd61Edit.visible = value;
  if (!value) {
    addDialogQ8dd61Edit.data = {};
  }
}
//14
const Q8dd62Edits = (row, type) => {
  addDialogQ8dd62Edit.title = "D62针对流出根本原因纠正措施验证";
  addDialogQ8dd62Edit.data = row;

  addDialogQ8dd62Edit.visible = true;

  if (type == "查看") {
    addDialogQ8dd62Edit.readvisible = true;
  } else {
    addDialogQ8dd62Edit.readvisible = false;
  }
};
const addDialogQ8dd62Edit = reactive<DialogOption>({
  visible: false,
  readvisible: false,
  title: "",
  data: {},
});
function changeVisibleQ8dd62Edit(value: boolean) {
  addDialogQ8dd62Edit.visible = value;
  if (!value) {
    addDialogQ8dd62Edit.data = {};
  }
}
//15
const Q8dd71Edits = (row, type) => {
  addDialogQ8dd71Edit.title = "D71预防措施PFMEA是否更新了这个失效模式";
  addDialogQ8dd71Edit.data = row;

  addDialogQ8dd71Edit.visible = true;

  if (type == "查看") {
    addDialogQ8dd71Edit.readvisible = true;
  } else {
    addDialogQ8dd71Edit.readvisible = false;
  }
};

const addDialogQ8dd71Edit = reactive<DialogOption>({
  visible: false,
  readvisible: false,
  title: "",
  data: {},
});
function changeVisibleQ8dd71Edit(value: boolean) {
  addDialogQ8dd71Edit.visible = value;
  if (!value) {
    addDialogQ8dd71Edit.data = {};
  }
}
//16
const Q8dd72Edits = (row, type) => {
  addDialogQ8dd72Edit.title = "D72预防措施类似过程的产品是否应用了这些改进措施";
  addDialogQ8dd72Edit.data = row;

  addDialogQ8dd72Edit.visible = true;

  if (type == "查看") {
    addDialogQ8dd72Edit.readvisible = true;
  } else {
    addDialogQ8dd72Edit.readvisible = false;
  }
};
const addDialogQ8dd72Edit = reactive<DialogOption>({
  visible: false,
  readvisible: false,
  title: "",
  data: {},
});
function changeVisibleQ8dd72Edit(value: boolean) {
  addDialogQ8dd72Edit.visible = value;
  if (!value) {
    addDialogQ8dd72Edit.data = {};
  }
}
//17
const Q8dd73Edits = (row, type) => {
  addDialogQ8dd73Edit.title = "D73预防措施涉及的管理流程更新";
  addDialogQ8dd73Edit.data = row;

  addDialogQ8dd73Edit.visible = true;

  if (type == "查看") {
    addDialogQ8dd73Edit.readvisible = true;
  } else {
    addDialogQ8dd73Edit.readvisible = false;
  }
};
const addDialogQ8dd73Edit = reactive<DialogOption>({
  visible: false,
  readvisible: false,
  title: "",
  data: {},
});
function changeVisibleQ8dd73Edit(value: boolean) {
  addDialogQ8dd73Edit.visible = value;
  if (!value) {
    addDialogQ8dd73Edit.data = {};
  }
}
//18
const Q8dd80Edits = (row, type) => {
  addDialogQ8dd80Edit.title = "D8团队总结和评价";
  addDialogQ8dd80Edit.data = row;
  addDialogQ8dd80Edit.visible = true;

  if (type == "查看") {
    addDialogQ8dd80Edit.readvisible = true;
  } else {
    addDialogQ8dd80Edit.readvisible = false;
  }
};
const addDialogQ8dd80Edit = reactive<DialogOption>({
  visible: false,
  readvisible: false,
  title: "",
  data: {},
});
function changeVisibleQ8dd80Edit(value: boolean) {
  addDialogQ8dd80Edit.visible = value;
  if (!value) {
    addDialogQ8dd80Edit.data = {};
  }
}
//19
const Q8dn1Edits = (row, type) => {
  addDialogQ8dn1Edit.title = "N1原因分析";
  addDialogQ8dn1Edit.data = row;
  addDialogQ8dn1Edit.visible = true;
  if (type == "查看") {
    addDialogQ8dn1Edit.readvisible = true;
  } else {
    addDialogQ8dn1Edit.readvisible = false;
  }
};
const addDialogQ8dn1Edit = reactive<DialogOption>({
  visible: false,
  readvisible: false,
  title: "",
  data: {},
});
function changeVisibleQ8dn1Edit(value: boolean) {
  addDialogQ8dn1Edit.visible = value;
  if (!value) {
    addDialogQ8dn1Edit.data = {};
  }
}
//20
const Q8dn2Edits = (row, type) => {
  addDialogQ8dn2Edit.title = "N2纠正预防措施及完成时间";
  addDialogQ8dn2Edit.data = row;

  addDialogQ8dn2Edit.visible = true;

  if (type == "查看") {
    addDialogQ8dn2Edit.readvisible = true;
  } else {
    addDialogQ8dn2Edit.readvisible = false;
  }
};
const addDialogQ8dn2Edit = reactive<DialogOption>({
  visible: false,
  readvisible: false,
  title: "",
  data: {},
});
function changeVisibleQ8dn2Edit(value: boolean) {
  addDialogQ8dn2Edit.visible = value;
  if (!value) {
    addDialogQ8dn2Edit.data = {};
  }
}
//21
const Q8dn3Edits = (row, type) => {
  addDialogQ8dn3Edit.title = "N3标准化及其它类似问题的纠正预防措施";
  addDialogQ8dn3Edit.data = row;

  addDialogQ8dn3Edit.visible = true;
  if (type == "查看") {
    addDialogQ8dn3Edit.readvisible = true;
  } else {
    addDialogQ8dn3Edit.readvisible = false;
  }
};
const addDialogQ8dn3Edit = reactive<DialogOption>({
  visible: false,
  readvisible: false,
  title: "",
  data: {},
});
function changeVisibleQ8dn3Edit(value: boolean) {
  addDialogQ8dn3Edit.visible = value;
  if (!value) {
    addDialogQ8dn3Edit.data = {};
  }
}
//22
const Q8dn4Edits = (row, type) => {
  addDialogQ8dn4Edit.title = "N4验证";
  addDialogQ8dn4Edit.data = row;

  addDialogQ8dn4Edit.visible = true;
  if (type == "查看") {
    addDialogQ8dn4Edit.readvisible = true;
  } else {
    addDialogQ8dn4Edit.readvisible = false;
  }
};
const addDialogQ8dn4Edit = reactive<DialogOption>({
  visible: false,
  readvisible: false,
  title: "",
  data: {},
});
function changeVisibleQ8dn4Edit(value: boolean) {
  addDialogQ8dn4Edit.visible = value;
  if (!value) {
    addDialogQ8dn4Edit.data = {};
  }
}
onMounted(() => {
  getOrganizationList();
  getProblemLevelList();
});

// 组件销毁时调用
onBeforeUnmount(() => {
  visibleDialog.value = false;
  emit("change-visible", false);
});
</script>
<style scoped lang="scss">
.formTable {
  // :deep(.el-form-item) {
  //   margin: 0 0 13px 0 !important;
  //   width: 100%;
  // }
  :deep(.el-scrollbar__wrap) {
    max-height: 200px;
    overflow-y: auto;
  }
}
</style>
